{% extends "base.html" %}

{% block title %}包管理日志{% endblock %}

{% block content %}
<div class="container-fluid">
    <!-- 页面标题 -->
    <div class="d-flex justify-content-between align-items-center mb-4">
        <h1 class="h3 mb-0 text-gray-800">
            <i class="fas fa-history mr-2"></i>包管理日志
        </h1>
        <div>
            <a href="{{ url_for('package_management') }}" class="btn btn-primary">
                <i class="fas fa-arrow-left mr-1"></i>返回管理
            </a>
        </div>
    </div>

    <!-- 日志列表 -->
    <div class="row">
        <div class="col-12">
            <div class="card shadow">
                <div class="card-header py-3">
                    <h6 class="m-0 font-weight-bold text-primary">操作历史</h6>
                </div>
                <div class="card-body">
                    {% if logs.items %}
                    <div class="table-responsive">
                        <table class="table table-bordered">
                            <thead>
                                <tr>
                                    <th>时间</th>
                                    <th>包名</th>
                                    <th>版本</th>
                                    <th>操作</th>
                                    <th>状态</th>
                                    <th>操作用户</th>
                                    <th>操作</th>
                                </tr>
                            </thead>
                            <tbody>
                                {% for log in logs.items %}
                                <tr>
                                    <td>
                                        <small>{{ log.created_at.strftime('%Y-%m-%d %H:%M:%S') if log.created_at else '未知时间' }}</small>
                                    </td>
                                    <td>
                                        <strong>{{ log.package_name }}</strong>
                                    </td>
                                    <td>
                                        {% if log.version %}
                                        <span class="badge badge-secondary">{{ log.version }}</span>
                                        {% else %}
                                        <span class="text-muted">-</span>
                                        {% endif %}
                                    </td>
                                    <td>
                                        {% if log.operation == 'install' %}
                                        <span class="badge badge-primary">
                                            <i class="fas fa-download mr-1"></i>安装
                                        </span>
                                        {% elif log.operation == 'uninstall' %}
                                        <span class="badge badge-danger">
                                            <i class="fas fa-trash mr-1"></i>卸载
                                        </span>
                                        {% elif log.operation == 'upgrade' %}
                                        <span class="badge badge-warning">
                                            <i class="fas fa-arrow-up mr-1"></i>升级
                                        </span>
                                        {% else %}
                                        <span class="badge badge-secondary">{{ log.operation }}</span>
                                        {% endif %}
                                    </td>
                                    <td>
                                        {% if log.status == 'success' %}
                                        <span class="badge badge-success">
                                            <i class="fas fa-check mr-1"></i>成功
                                        </span>
                                        {% elif log.status == 'failed' %}
                                        <span class="badge badge-danger">
                                            <i class="fas fa-times mr-1"></i>失败
                                        </span>
                                        {% elif log.status == 'running' %}
                                        <span class="badge badge-warning">
                                            <i class="fas fa-spinner fa-spin mr-1"></i>执行中
                                        </span>
                                        {% else %}
                                        <span class="badge badge-secondary">{{ log.status }}</span>
                                        {% endif %}
                                    </td>
                                    <td>
                                        <small>{{ log.user.username if log.user else '系统' }}</small>
                                    </td>
                                    <td>
                                        <button class="btn btn-info btn-sm" onclick="viewLogDetails({{ log.id }})">
                                            <i class="fas fa-eye"></i>
                                        </button>
                                    </td>
                                </tr>
                                {% endfor %}
                            </tbody>
                        </table>
                    </div>

                    <!-- 分页 -->
                    {% if logs.pages > 1 %}
                    <nav aria-label="日志分页">
                        <ul class="pagination justify-content-center">
                            {% if logs.has_prev %}
                            <li class="page-item">
                                <a class="page-link" href="{{ url_for('package_logs', page=logs.prev_num) }}">上一页</a>
                            </li>
                            {% endif %}
                            
                            {% for page_num in logs.iter_pages() %}
                                {% if page_num %}
                                    {% if page_num != logs.page %}
                                    <li class="page-item">
                                        <a class="page-link" href="{{ url_for('package_logs', page=page_num) }}">{{ page_num }}</a>
                                    </li>
                                    {% else %}
                                    <li class="page-item active">
                                        <span class="page-link">{{ page_num }}</span>
                                    </li>
                                    {% endif %}
                                {% else %}
                                <li class="page-item disabled">
                                    <span class="page-link">...</span>
                                </li>
                                {% endif %}
                            {% endfor %}
                            
                            {% if logs.has_next %}
                            <li class="page-item">
                                <a class="page-link" href="{{ url_for('package_logs', page=logs.next_num) }}">下一页</a>
                            </li>
                            {% endif %}
                        </ul>
                    </nav>
                    {% endif %}
                    
                    {% else %}
                    <div class="text-center py-4">
                        <i class="fas fa-inbox fa-3x text-gray-300 mb-3"></i>
                        <h5 class="text-gray-500">暂无操作日志</h5>
                        <p class="text-gray-400">还没有进行过包管理操作</p>
                    </div>
                    {% endif %}
                </div>
            </div>
        </div>
    </div>
</div>

<!-- 日志详情模态框 -->
<div class="modal fade" id="logDetailsModal" tabindex="-1">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">操作详情</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <div class="modal-body">
                <div id="logDetailsContent"></div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">关闭</button>
            </div>
        </div>
    </div>
</div>
{% endblock %}

{% block scripts %}
<script>
// 查看日志详情
function viewLogDetails(logId) {
    $.ajax({
        url: `/package_log/${logId}`,
        method: 'GET',
        success: function(response) {
            if (response.success) {
                const log = response.log;
                let content = `
                    <div class="mb-3">
                        <h6>操作信息</h6>
                        <table class="table table-sm">
                            <tr><td>包名:</td><td><strong>${log.package_name}</strong></td></tr>
                            <tr><td>版本:</td><td>${log.version || '最新版本'}</td></tr>
                            <tr><td>操作:</td><td>${getOperationText(log.operation)}</td></tr>
                            <tr><td>状态:</td><td>${getStatusBadge(log.status)}</td></tr>
                            <tr><td>操作用户:</td><td>${log.user_name}</td></tr>
                            <tr><td>操作时间:</td><td>${formatDateTime(log.created_at)}</td></tr>
                            <tr><td>运行时间:</td><td>${formatDuration(log.duration)}</td></tr>
                        </table>
                    </div>
                `;
                
                if (log.output) {
                    content += `
                        <div class="mb-3">
                            <h6>输出信息</h6>
                            <pre class="custom-pre" style="max-height: 300px; overflow-y: auto;"><code>${log.output}</code></pre>
                        </div>
                    `;
                }
                
                if (log.error_message) {
                    content += `
                        <div class="mb-3">
                            <h6>错误信息</h6>
                            <div class="alert alert-danger">${log.error_message}</div>
                        </div>
                    `;
                }
                
                $('#logDetailsContent').html(content);
                $('#logDetailsModal').modal('show');
            } else {
                alert('获取日志详情失败: ' + response.message);
            }
        },
        error: function() {
            alert('获取日志详情失败');
        }
    });
}

// 获取操作文本
function getOperationText(operation) {
    const operationMap = {
        'install': '<span class="badge badge-primary"><i class="fas fa-download mr-1"></i>安装</span>',
        'uninstall': '<span class="badge badge-danger"><i class="fas fa-trash mr-1"></i>卸载</span>',
        'upgrade': '<span class="badge badge-warning"><i class="fas fa-arrow-up mr-1"></i>升级</span>'
    };
    return operationMap[operation] || `<span class="badge badge-secondary">${operation}</span>`;
}

// 获取状态徽章
function getStatusBadge(status) {
    const statusMap = {
        'success': '<span class="badge badge-success"><i class="fas fa-check mr-1"></i>成功</span>',
        'failed': '<span class="badge badge-danger"><i class="fas fa-times mr-1"></i>失败</span>',
        'running': '<span class="badge badge-warning"><i class="fas fa-spinner fa-spin mr-1"></i>执行中</span>'
    };
    return statusMap[status] || `<span class="badge badge-secondary">${status}</span>`;
}

// 格式化日期时间
function formatDateTime(dateTimeStr) {
    if (!dateTimeStr) return '-';
    const date = new Date(dateTimeStr);
    return date.toLocaleString('zh-CN');
}

// 格式化持续时间
function formatDuration(seconds) {
    if (!seconds) return '-';
    
    const hours = Math.floor(seconds / 3600);
    const minutes = Math.floor((seconds % 3600) / 60);
    const secs = Math.floor(seconds % 60);
    
    if (hours > 0) {
        return `${hours}时${minutes}分${secs}秒`;
    } else if (minutes > 0) {
        return `${minutes}分${secs}秒`;
    } else {
        return `${secs}秒`;
    }
}
</script>
{% endblock %} 